Ext.BLANK_IMAGE_URL = '../js/resources/images/default/s.gif';

Ext.onReady(function() {
	var f = new Ext.form.FormPanel( {
		title : "欢迎登陆",// 表单面板的标题
		width : 320,// 面板宽度
		height : 160,// 面板高度
		url : 'handle.jsp',
		fileUpload: true,
		bodyStyle : "padding: 6px",// 正文区域的样式
		labelAlign : "right",// 统一的提示信息对齐方式，此处为右对齐
		frame : true,// 此处为true可以得到更好的效果
		items : [ new Ext.form.TextField( {
			name : "userName",// 用于访问的 name
			allowBlank : false, // 不允许为空
			fieldLabel : "用户名"// 表单域提示信息
		}), {
			name : "password",
			xtype : "textfield",// 表示表单域的类型，此处即为Ext.form.TextField
			inputType : "password",// 输入框类型，有三种类型：文本框、密码框、
			// 文件域
			fieldLabel : "密码",// 提示信息
			allowBlank : false
		// 不允许为空
				},{
					  name: "txtPhoto", 
					  xtype : "textfield",
					  inputType: "file", 
					  fieldLabel: "照片", 
					  width: 500 
					}],
		buttons : [ {
			text : "确定",
			handler : function() {
				// 得到name为 userName的表单域控件的值
				var userName = f.getForm().findField("userName").getValue();
				var password = f.getForm().findField("password").getValue();
				Ext.Msg.alert("", "用户名：" + userName + "<br>密码：" + password);
				f.getForm().submit({
					method: 'post',
					success:function(form, action){
						alert(action.result.obj.name);
					}
				});
		}
		}, {
			text : "重置",
			handler : function() {
				f.getForm().reset();// 重置表单面板中所有表单组件的值
		}
		} ]
	});
	
	f.render('aa');
})
